<!DOCTYPE html>
<html lang="zh-CN">

<head>
	<meta charset="UTF-8" />
	<meta http-equiv="X-UA-Compatible" content="IE=edge" />
	<meta name="viewport" content="width=device-width, initial-scale=1" />

	<title>文件管理器</title>

	<!-- Bootstrap -->
	<link href="libs/bootstrap/dist/css/bootstrap.css" rel="stylesheet" />
	<!--<link href="libs/bootstrap-treeview/dist/bootstrap-treeview.css" rel="stylesheet" />-->
	<link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.3.1/css/bootstrap-responsive.min.css"
	/>
	<!-- local style -->
	<link href="styles/fileman.css" rel="stylesheet">
</head>

<body>
	<header id="header">
		<nav id="headbar" class="navbar navbar-default navbar-inverse" role="navigation">
			<div class="navbar-header">
				<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#head_bar_content">
					<span class="sr-only">Toggle navigation</span>
					<span class="icon-bar"></span>
					<span class="icon-bar"></span>
					<span class="icon-bar"></span>
				</button>
				<a class="navbar-brand" href="#">文件管理器</a>
			</div>
			<div id="headbar_content" class="collapse navbar-collapse">
				<ul class="nav navbar-nav">
					<li class="active"><a href="#">首页</a></li>
					<li class="dropdown">
						<a href="#" class="dropdown-toggle" data-toggle="dropdown">功能<span class="caret"></span></a>
						<ul class="dropdown-menu" role="menu">
							<li class="dropdown-header">业务功能</li>
							<li><a href="#">信息建立</a></li>
							<li><a href="#">信息查询</a></li>
							<li><a href="#">信息管理</a></li>
							<li class="divider"></li>
							<li class="dropdown-header">系统功能</li>
							<li><a href="#">设置</a></li>
						</ul>
					</li>
					<li><a href="#">帮助</a></li>
				</ul>
			</div>
		</nav>
	</header>
	<div id="frame">
		<div id="first_frame" class="frame">
			<!--<label for="treeview"></label>-->
			<!--<div id="treeview"></div>-->
			<div id="directory_pannel" class="frame-pannel tree-list">
				<label class="frame-pannel-header">文件夹</label>
				<ul class="">
					<li>
						<span class="icon glyphicon glyphicon-plus">&nbsp;</span>
						<span class="info">2</span>
						<a href="#">Dir Root</a>
						<ul>
							<li>
								<span class="icon">&nbsp;</span>
								<a href="#">Dir 1</a>
							</li>
							<li>
								<span class="icon glyphicon glyphicon-plus">&nbsp;</span>
								<span class="info">3</span>
								<a href="#">Dir 2</a>
								<ul>
									<li>
										<span class="icon glyphicon glyphicon-plus">&nbsp;</span>
										<a href="#">Dir 2.1</a>
									</li>
									<li>
										<span class="icon glyphicon glyphicon-plus">&nbsp;</span>
										<a href="#">
											<span class="info">1 / 2</span>
											<span class="link">Dir 2.2 Dir 2.2 Dir 2.2 Dir 2.2 Dir 2.2 Dir 2.2 Dir 2.2 Dir 2.2 Dir 2.2</span>
										</a>
										<ul>
											<li>
												<span class="icon">&nbsp;</span>
												<a href="#">Link</a>
											</li>
											<li>
												<span class="icon">&nbsp;</span><a href="#">Link</a>
											</li>
										</ul>
									</li>
									<li>
										<span class="icon">&nbsp;</span>
										<a href="#">Dir 2.3</a>
									</li>
								</ul>
							</li>
						</ul>
					</li>
				</ul>
			</div>
		</div>
		<div id="second_frame">
			<div class="file_pannel" class="frame-pannel item-list">
				<label class="frame-pannel-header">文件</label>
				<ul>
					<li><a href="#">File 1</a></li>
					<li><a href="#">File 2</a></li>
					<li><a href="#">File 3</a></li>
					<li><a href="#">File 4</a></li>
					<li><a href="#">File 5</a></li>
					<li><a href="#">File 6</a></li>
					<li><a href="#">File 7</a></li>
					<li><a href="#">File 8</a></li>
					<li><a href="#">File 9</a></li>
					<li><a href="#">File 10</a></li>
				</ul>
			</div>
		</div>
		<div id="main_frame">
			中栏
			<ul class="nav nav-tabs nav-stacked">
				<li>
					<a href="#">Home</a> </li>
				<li><a href="#">Tutorials</a></li>
				<li class="active"><a href="#">Practice Editor </a></li>
				<li><a href="#">Gallery</a></li>
				<li><a href="#">Contact</a></li>
			</ul>
			<div class="header">
				中栏头部
				<div class="header">
					中栏头部
					<div class="header">
						中栏头部
					</div>
				</div>
			</div>
			<div class="header">
				中栏头部
			</div>
		</div>
	</div>
	<!-- div#frame -->
	<footer id="footer">状态栏区域</footer>
</body>

<script lang="javascript" src="libs/fileman.js" type="text/javascript" charset="utf-8"></script>
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<!--<script lang="javascript" src="libs/jquery/dist/jquery.js" type="text/javascript" charset="utf-8"></script>-->
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script lang="javascript" src="libs/bootstrap/dist/js/bootstrap.js" type="text/javascript" charset="utf-8"></script>
<script lang="javascript" src="libs/bootstrap-treeview/dist/bootstrap-treeview.js" type="text/javascript" charset="utf-8"></script>
<!-- local script -->
<script lang="javascript" src="scripts/fileman.js" type="text/javascript" charset="utf-8"></script>

</html>